<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<meta name="viewport" content="width=device-width,initial-scale=1.0,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no"/>
	<meta name="format-detection" content="telephone=no">
	<title>开通谁查看我功能</title>
	<link rel="stylesheet" href="http://xhh.wasd1.cn/static/css/base.css">
	<link rel="stylesheet" href="../css/icon.css">
	<link rel="stylesheet" href="../css/index.css">
</head>
<body>
<div id="open" class="flexv wrap">
	<div class="flex center head">
		<a href="javascript:;" class="bls bls-zjt"></a>
		<h1 class="flexitem center">开通谁查看我功能</h1>
		<a href="javascript:;" class="bls bls-dian"></a>
	</div>
	
	<div class="flexitemv mainbox">
		<div class="state">状态：<span>未开通</span></div>
		<div class="bjimg">
			<div class="userimg">
				<img src="../image/banner.jpg" class="fitimg">
			</div>
			<div class="option">
				<div class="discount">
					<div class="flex sale">
						<div class="flexv">
							<div class="price">
								<span>12个月</span>
								<em>&yen; 99</em>
							</div>
							<div class="cost">
								<i class="original">原价 199元</i>
								<span>立省100元</span>
							</div>
							<div class="flex center cornu">优惠</div>
						</div>
						<div class="flexitem endh ">
							<a href="javascript:;" class="flex center discounts">优惠抢购</a>
						</div>
					</div>
					<div class="flex month">
						<div class="flexv center price">
							<span>1个月</span>
							<em>&yen; 19.9</em>
						</div>
						<div class="flexitem endh">
							<a href="javascript:;" class="flex center discounts">购买</a>
						</div>
					</div>
				</div>
			</div>
		</div>
	</div>
	<!--弹框-->
	<div class="flex center alert">
		<div class="mask"></div>
		<div class='content'>
			<h3 class="flex center">购买成功</h3>
			<div class="img">
				<img src="../image/dredge_bj.png" class="fitimg">
			</div>
			<div class="flex center indate">
				<div>有效期至：</div>
				<span>2017-09-15 10:42:20</span>
			</div>
			<div class="button">
				<a href="javascript:;" class="flex center">去看看谁查看了我的头条</a>
			</div>
		</div>
	</div>
</div>
</body>
<script type="text/javascript" src="https://cdn.bootcss.com/zepto/1.2.0/zepto.min.js"></script>
<script type="text/javascript">
	$(".option a").click(function () {
        $(".alert").css({"display":"block"});
        $(".alert").find(".content").addClass('trans');
    });
    $(".mask").click(function(){
        $(".alert").css({"display":"none"});
    });
</script>
</html>